<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utg-8">
<title>药品上架</title>
</head>
<body>
<div id="putaway" class="panel panel-info">

    <div class="panel-heading">
        <h3 class="panel-title">药品上架</h3>
    </div>
    
    <div class="panel-body">
			<div class="form-group">
				<input id="scan" v-model="traceCode" @keyup.enter="enter"
					class="form-control" type="text" v-bind:placeholder="placeholder" />
			</div>

			<table  id="putaway_table"></table>
	</div>
	
</div>
<div id="btn_div"  class="pull-right">
	<!--  <button type="button" class="btn btn-info" @click="back">返回</button>-->
	<button type="button" class="btn btn-info" @click="submit">提交</button>
</div>

</body>

<script type="text/javascript">

	//一个箱子组
	function PutawayCase(caseTraceCode,medicineName,medicineId){
		this.caseTraceCode = caseTraceCode;
		this.medicineName = medicineName;
		this.medicineId = medicineId;
		this.boxTraceCodes=[];
	}
	//没个元素为一个箱子组
	var data=[];
	
	var putaway = new Vue({
		el : "#putaway",
		data:{
			placeholder: '请扫描药品追溯码',
			traceCode : '',
			//记录当前上架箱子信息
			currentCaseTraceCode:''
		},
		methods:{
			enter : function(){
				if(this.traceCode.replace(/\D/g, '').length < 24){
						speak('输入有误');
						this.traceCode = '';
						return;
				}
				var traceCode = this.traceCode.substring(0, 24);
				//查重
				for(let i=0;i<data.length;i++){
					//箱子去重，并且设置为当前上架箱子
					if(data[i].caseTraceCode == traceCode){
						this.currentCaseTraceCode = data[i].caseTraceCode;
						this.traceCode = '';
						//提示箱子已经扫描
						speak('箱子已扫描');
						return ;		
					}						
					//当前箱子，盒子去重
					var boxArray = data[i].boxTraceCodes;
						for(let j=0; j<boxArray.length; j++){
							if(boxArray[j] == traceCode){
								this.traceCode = '';
								//提示药品已经扫描
								speak('药品已扫描')
								return ;
							}
					}	
					
				}
				//检查是否上架,同步请求
				$.ajax({
						url:'<%=request.getContextPath()%>/mp/boxTraceCode',
						asyn: false,
						type : "post",
						asyn:false,
						data:"traceCode="+traceCode,
						success: function(result){
							if(result.caseTraceCode == "0"){
								//未上架，检查是否进库
								$.ajax({
									url:'<%=request.getContextPath()%>/mp/caseTraceCode',
									type : "post",
									asyn: false,
									data:"traceCode="+putaway.traceCode.replace(/\D/g, ''),
									success: function(result){
										//alert(JSON.stringify(result));
										if(result.caseTraceCode != "0"){
											//已入库，提示添加新的上架箱子成功
											putaway.currentCaseTraceCode = putaway.traceCode;
											putaway.traceCode = '';
											data.push(new PutawayCase(result.caseTraceCode, result.medicineName, result.medicineId));
											refreshPutawayTable();
											speak('添加箱子成功')
										}else{
											//未入库，可能为箱子，也可能为盒子
											//1. 默认是盒子，因为上架是入库之后的操作
											//2. 骚的是未入库的箱子，且是同一种药品，sorry，处理不了
											//检查是否与当前箱子为同类药品
											for(let i=0;i<data.length;i++){
												if(putaway.currentCaseTraceCode.substring(0,24) == data[i].caseTraceCode){
													if( putaway.currentCaseTraceCode.substring(24)== putaway.traceCode.substring(24)){
														//与当前箱子是同一种药品，提示添加成功
														data[i].boxTraceCodes.push(traceCode);
														putaway.traceCode = '';
														refreshPutawayTable();
														speak('上架成功');
													}else{
														//不是同一种，应该提示与当前箱子药品不符合
														putaway.traceCode = '';
														speak('错误 扫描的药品与当前箱子不是同一类药品');
													}
												}					
												
											}
											
										}
									}
								});
							}else{
								//提示药品已上架
								speak('药品已上架');
								putaway.traceCode = '';
							}
						}
					});
			},
			init: function(){
				this.placeholder='请先扫描箱子追溯码';
				this.traceCode = '';
				this.putawayItem= {};
				this.isTip = false;
				this.isNext = false;
			}
		}
	});
	
	
	
	
	
	var btnDiv = new Vue({
		el : '#btn_div',
		methods:{
			back: function(){
				putaway.init();
				data = [];
				$("#putaway_table").bootstrapTable('refresh');
			},
			submit:function(){
				if(data.length==0){
					speak('无可提交数据');
				}else{
					$.ajax({
						type:"post",
						url:'<%=request.getContextPath()%>/mp/save/'+employee.id,
						data:JSON.stringify(data),
						contentType:'application/json',
						success:function(){
							speak('提交成功');
							btnDiv.back();
						}
					});
				}
			}
		}
	});

	var refreshPutawayTable = function(){
		$("#putaway_table").bootstrapTable('refresh');
	}
	$("#putaway_table").bootstrapTable({ // 对应table标签的id
	  method:"get",
      url: "<%=request.getContextPath()%>/m/nothing", // 获取表格数据的url
      cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
      striped: true,  //表格显示条纹，默认为false
      pagination: true, // 在表格底部显示分页组件，默认false
      pageList: [20,50,100], // 设置页面可以显示的数据条数
      pageSize: 50, // 页面数据条数
      pageNumber: 1, // 首页页码
      sidePagination: 'client', // 设置为服务器端分页
      columns: [
      	{
              field: 'type', // 返回json数据中的name
              title: '', // 表格表头显示文字
              align: 'center', // 左右居中
              valign: 'middle'// 上下居中
              
          },
         {
              field: 'traceCode', // 返回json数据中的name
              title: '追溯码', // 表格表头显示文字
              align: 'center', // 左右居中
              valign: 'middle'// 上下居中
              
          },
          {
              field: 'name', // 返回json数据中的name
              title: '药品名称', // 表格表头显示文字
              align: 'center', // 左右居中
              valign: 'middle'// 上下居中
              
          }
          
      ],
      responseHandler:function (res) {
      		var displayData = [];
      		for(let i=0; i<data.length; i++){
      			displayData.push({type:'【'+'箱子'+'】',traceCode:'【'+data[i].caseTraceCode+'】',name:'【'+data[i].medicineName+'】'});
      			for(let j=0; j<data[i].boxTraceCodes.length; j++){
      				displayData.push({type:''+(j+1),traceCode:data[i].boxTraceCodes[j],name:data[i].medicineName});
      			}
      		}
            return displayData;
      },
      onLoadSuccess: function(){  //加载成功时执行
            console.info("加载成功");
      },
      onLoadError: function(){  //加载失败时执行
            console.info("加载数据失败");
      }

	});
	
</script>

</html>